<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>商城后台</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" th:href="@{/lib/layui-v2.5.5/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
    <link rel="stylesheet" th:href="@{/lib/layui_ext/dtree/dtree.css}" >
    <link rel="stylesheet" th:href="@{/lib/layui_ext/dtree/font/dtreefont.css}" >
    <style>
        body {
            background-color: #ffffff;
        }
        .layui-table-cell {
            height: auto !important;
            white-space: normal;
        }
    </style>


</head>
<body>

<span th:replace="common_page::common"></span>

<div class="layuimini-container" style="height:100%">
    <div class="layui-form layuimini-form">
        <input type="hidden" name="id" id="id" th:value="${model.id}">

        <div class="layuimini-main" >
            <div class="layui-tab layui-tab-brief">
                <ul class="layui-tab-title">
                    <li class="layui-this">订单信息</li>
                    <li>物流信息</li>
                </ul>

                <div class="layui-tab-content">
                    <div class="layui-tab-item layui-show">
                        <div class="layui-inline" style="width:80%">
                            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                                <legend>订单详情</legend>
                            </fieldset>
                            <div class="layui-form layuimini-form">
                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >主订单号</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.mainOrderNo}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >订单号</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderNo}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >用户ID</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.userId}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >店铺ID</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.shopId}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >运费金额</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${model.freightAmount}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >红包金额</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${model.redPackageAmount}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >优惠券金额</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${model.couponAmount}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  style="white-space: nowrap!important;">订单金额(不算折扣)</label>
                                        <div class="layui-input-block" style="margin-left: 160px;">
                                            <input type="text"  th:value="${model.totalAmount}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>

                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " style="white-space: nowrap!important;" >订单金额(折扣算完)</label>
                                        <div class="layui-input-block" style="margin-left: 160px;">
                                            <input type="text"  th:value="${model.orderAmount}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >付款金额</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${model.payAmount}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:80%">
                                        <label class="layui-form-label " style="white-space: nowrap!important;" >订单备注</label>
                                        <div class="layui-input-block"   style="margin-left: 120px;">
                                            <textarea name="remark" class="layui-textarea" th:text="${model.remark}" ></textarea>
                                        </div>
                                    </div>
                                </div>

                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >交易流水号</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${model.outerTradeNo}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >支付状态</label>
                                        <div class="layui-input-block" th:if="${model.payStatus eq 0}" >
                                            <select name="payStatus"  lay-search="">
                                                <option value="0" selected>未支付</option>
                                                <option value="1" >已支付</option>
                                                <option value="3" >线下支付已到账</option>
                                                <option value="4" >取消支付</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.payStatus eq 1}" >
                                            <select name="payStatus"  lay-search="">
                                                <option value="0" >未支付</option>
                                                <option value="1" selected>已支付</option>
                                                <option value="3" >线下支付已到账</option>
                                                <option value="4" >取消支付</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.payStatus eq 3}" >
                                            <select name="payStatus"  lay-search="">
                                                <option value="0" >未支付</option>
                                                <option value="1" >已支付</option>
                                                <option value="3" selected>线下支付已到账</option>
                                                <option value="4" >取消支付</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.payStatus eq 4}" >
                                            <select name="payStatus"  lay-search="">
                                                <option value="0" >未支付</option>
                                                <option value="1" >已支付</option>
                                                <option value="3" >线下支付已到账</option>
                                                <option value="4" selected>取消支付</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <div class="layui-form-item" >

                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >交易状态</label>
                                        <div class="layui-input-block" th:if="${model.tradeStatus eq 0}" >
                                            <select name="tradeStatus"  lay-search="">
                                                <option value="0" selected>待付款</option>
                                                <option value="1" >待收货</option>
                                                <option value="2" >已取消</option>
                                                <option value="3" >已完成</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.tradeStatus eq 1}" >
                                            <select name="tradeStatus"  lay-search="">
                                                <option value="0" >待付款</option>
                                                <option value="1" selected>待收货</option>
                                                <option value="2" >已取消</option>
                                                <option value="3" >已完成</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.tradeStatus eq 2}" >
                                            <select name="tradeStatus"  lay-search="">
                                                <option value="0" >待付款</option>
                                                <option value="1" >待收货</option>
                                                <option value="2" selected>已取消</option>
                                                <option value="3" >已完成</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.tradeStatus eq 3}" >
                                            <select name="tradeStatus"  lay-search="">
                                                <option value="0" >待付款</option>
                                                <option value="1" >待收货</option>
                                                <option value="2" >已取消</option>
                                                <option value="3" selected>已完成</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >支付方式</label>
                                        <div class="layui-input-block" th:if="${model.payMethod eq 1}" >
                                            <select name="payMethod"  lay-search="">
                                                <option value="1" selected>线上支付</option>
                                                <option value="2" >线下支付</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.payMethod eq 2}" >
                                            <select name="payMethod"  lay-search="">
                                                <option value="1" >线上支付</option>
                                                <option value="2" selected>线下支付</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">

                                        <label class="layui-form-label "  >支付渠道</label>
                                        <div class="layui-input-block" th:if="${model.payType eq -1}" >
                                            <select name="payType"  lay-search="">
                                                <option  value="-1" selected>未确定</option>
                                                <option value="0" >微信</option>
                                                <option value="1" >支付宝</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.payType eq 0}" >
                                            <select name="payType"  lay-search="">
                                                <option  value="-1" >未确定</option>
                                                <option value="0" selected>微信</option>
                                                <option value="1" >支付宝</option>
                                            </select>
                                        </div>
                                        <div class="layui-input-block" th:if="${model.payType eq 1}" >
                                            <select name="payType"  lay-search="">
                                                <option value="-1" >未确定</option>
                                                <option value="0" >微信</option>
                                                <option value="1" selected>支付宝</option>
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >支付时间</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${#dates.format(model.payDate,'yyyy-MM-dd HH:mm:ss')}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " style="white-space: nowrap!important;" >取消订单时间</label>
                                        <div class="layui-input-block"   style="margin-left: 120px;">
                                            <input type="text"  th:value="${#dates.format(model.cancelDate,'yyyy-MM-dd HH:mm:ss')}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label "  >创建时间</label>
                                        <div class="layui-input-block" >
                                            <input type="text"  th:value="${#dates.format(model.createDate,'yyyy-MM-dd HH:mm:ss')}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>



                                <div class="layui-inline" style="width:80%">
                                    <label class="layui-form-label " style="white-space: nowrap!important;" >取消订单备注</label>
                                    <div class="layui-input-block"   style="margin-left: 120px;">
                                        <textarea name="remark" class="layui-textarea" th:text="${model.cancelRemark}" ></textarea>
                                    </div>
                                </div>
                                <!--<div class="layui-form-item" >-->
                                <!--<div class="layui-inline" style="width:40%">-->
                                <!--<label class="layui-form-label " >上架状态</label>-->
                                <!--<div class="layui-input-block "  style="padding-top:7px;" >-->
                                <!--<a th:if="${model.status!=null&&model.status eq 0}">未上架</a>-->
                                <!--<a th:if="${model.status!=null&&model.status eq 1}">已上架</a>-->
                                <!--</div>-->
                                <!--</div>-->
                                <!--</div>-->
                            </div>
                        </div>



                        <div class="layui-inline" style="width:80%">
                            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                                <legend>收货人信息</legend>
                            </fieldset>
                            <div class="layui-form layuimini-form">
                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >收货人</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.name}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >收货人电话</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.phone}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>


                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >省份编码</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.provinceCode}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >省份名称</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.provinceName}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>



                                <div class="layui-form-item" >

                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >地市编码</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.cityCode}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >地市名称</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.cityName}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>



                                <div class="layui-form-item" >
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >区县编码</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.areaCode}"  class="layui-input">
                                        </div>
                                    </div>
                                    <div class="layui-inline" style="width:40%">
                                        <label class="layui-form-label " >区县名称</label>
                                        <div class="layui-input-block">
                                            <input type="text"  th:value="${model.orderConsigneeAddress.areaName}"  class="layui-input">
                                        </div>
                                    </div>
                                </div>

                                <div class="layui-inline" style="width:80%">
                                    <label class="layui-form-label "  >收货地址</label>
                                    <div class="layui-input-block"  >
                                        <textarea name="remark" class="layui-textarea" th:text="${model.orderConsigneeAddress.address}" ></textarea>
                                    </div>
                                </div>

                            </div>
                        </div>



                        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
                            <legend>订单项列表</legend>
                        </fieldset>
                        <table class="layui-hide" id="orderItemSkuTable" ></table>
                    </div>

                    <div class="layui-tab-item">


                    </div>

                </div>
            </div>
        </div>
    </div>
</div>

<script th:src="@{/lib/layui-v2.5.5/layui.js}" charset="utf-8"></script>
<script>
    layui.use(['form','element', 'table','carousel'], function () {
        var $ = layui.jquery,
            table = layui.table,
            element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块

        var orderId = $("#id").val();

        table.render({
            elem: '#orderItemSkuTable',
            url: "[[@{/}]]order/orderItem/list",
            method:'POST',
            where:{orderId:orderId},
            done:function(res, curr, count)
            {
            },
            cols: [
                [
                    {field: 'skuId',  title: '商品SKUID', width: 180},
                    {field: 'productSkuName',  title: '商品名称', width: 320},
                    {field: 'httpProductPreviewPath', width: 150, title: '商品预览',
                        templet: function (row) {
                            if(row.httpProductPreviewPath!=null) {
                                return "<a href='" + row.httpProductPreviewPath + "' target='_blank'><img src='" + row.httpProductPreviewPath + "' width='100' height='100'  /></a>";
                            }
                            return "";
                        }},
                    {field: 'deliveryStatus',  title: '配送状态', width: 100,
                        templet: function (row) {
                            if(row.deliveryStatus==0) {
                                return "未收货";
                            }
                            if(row.deliveryStatus==1) {
                                return "送货中";
                            }
                            if(row.deliveryStatus==2) {
                                return "已收货";
                            }
                            return row.deliveryStatus;
                        }},
                    {field: 'sellerStatus',  title: '卖家备货状态', width: 150,
                        templet: function (row) {
                            if(row.sellerStatus==0) {
                                return "备货中";
                            }
                            if(row.sellerStatus==1) {
                                return "备货完成";
                            }
                            if(row.sellerStatus==2) {
                                return "缺货";
                            }
                            return row.sellerStatus;
                        }},
                    {field: 'buyerStatus',  title: '买家状态', width: 100,
                        templet: function (row) {
                            if(row.buyerStatus==0) {
                                return "待收货";
                            }
                            if(row.buyerStatus==1) {
                                return "已收货";
                            }
                            if(row.buyerStatus==2) {
                                return "换货";
                            }
                            if(row.buyerStatus==3) {
                                return "退货";
                            }
                            return row.buyerStatus;
                        }},
                    {field: 'productPrice',  title: '商品单价', width: 120},
                    {field: 'productNum',  title: '购买数量', width: 120},
                    {field: 'orderItemAmount',  title: '总金额', width: 120},
                    {field: 'deliveryReceiveTime',  title: '收货时间', width: 120},
                    {field: 'deliveryFinishTime',  title: '配送完成时间', width: 120},
                    {field: 'sellerFinishTime',  title: '卖家完成时间', width: 120},
                    {field: 'buyerFinishTime',  title: '买家完成时间', width: 120},
                    {field: 'freightTemplateId',  title: '运费模板ID', width: 120}



                ]
            ],
            limits: [15,30,100,200],
            limit: 15,
            page: true,
            skin: 'line'
        });


    });
</script>
</body>
</html>